<!DOCTYPE html>
<html class="x-admin-sm">

<head>
<meta charset="UTF-8">
<title>欢迎页面-X-admin2.2</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="stylesheet" href="../../css/font.css">
<link rel="stylesheet" href="../../css/xadmin.css">
<script type="text/javascript" src="../../lib/layui/layui.js"
	charset="utf-8"></script>
<script type="text/javascript" src="../../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
<!--[if lt IE 9]>
        <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
        <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>
	<div class="layui-fluid">
		<div class="layui-row layui-col-space10" >
			<div class="layui-col-md4">
				<form class="layui-form" action="">
				
					<input name="id" type="hidden" th:value="${obj== null?'':obj.id}">
					
					<div class="layui-form-item">
						<label class="layui-form-label">登录账户</label>
						<div class="layui-input-block">
							<input type="text" name="account" readonly="readonly" th:value="${obj== null?'':obj.account}" required lay-verify="required"
								 autocomplete="off" class="layui-input">
						</div>
					</div>
					
					<div class="layui-form-item">
						<label class="layui-form-label">联系手机</label>
						<div class="layui-input-block">
							<input type="text" name="mobile" readonly="readonly" th:value="${obj== null?'':obj.mobile}" required lay-verify="required"
								 autocomplete="off" class="layui-input">
						</div>
					</div>
					
					<div class="layui-form-item">
						<label class="layui-form-label">店铺名称</label>
						<div class="layui-input-block">
								<input type="text" name="shopName" th:value="${obj== null?'':obj.shopName}" required lay-verify="required"
								 autocomplete="off" class="layui-input">
						</div>
					</div>
					
					<div class="layui-form-item">
						<label class="layui-form-label">店铺地址</label>
						<div class="layui-input-block">
								<input type="text" name="address" th:value="${obj== null?'':obj.address}" required lay-verify="required"
								 autocomplete="off" class="layui-input">
						</div>
					</div>
					
					<input type="hidden" name="shopImg" th:value="${obj== null?'':obj.shopImg}" >
					<div class="layui-form-item">
						<label class="layui-form-label">修改头像</label>
						<div class="layui-input-block">
							<button type="button" class="layui-btn" id="shopImg">
								<i class="layui-icon">&#xe67c;</i>上传图片
							</button>
							<button type="button" class="layui-btn" onclick="del()">
								<i class="layui-icon">&#xe65c;</i>
							</button>
						</div>
					</div>
					<div class="layui-form-item">
						<div class="layui-input-block">
							<button class="layui-btn" lay-submit lay-filter="add">立即提交</button>
							<button type="reset" class="layui-btn layui-btn-primary">重置</button>
						</div>
					</div>
				</form>
			</div>
			<div class="layui-col-md2" id='imgLook'>
				<img style="width: 100px;height: 100px" th:src="${obj == null?'':obj.shopImg}">
			</div>
			
		</div>
	</div>
	<script>
		layui.use([ 'form', 'layer', 'upload' ], function() {
			$ = layui.jquery;
			var form = layui.form, layer = layui.layer;
			var upload = layui.upload;
			//执行实例 上传大图
			var uploadInst = upload.render({
				elem : '#shopImg',
				url : '/fileUpload', //上传接口
				choose:function(obj){
					//图片预览
					obj.preview(function(index, file, result){
				      var img = "<img src='"+result+"' style='width:100px;height:100px'>"
				      $("#imgLook").empty();
				      $("#imgLook").append(img)
					});
				},
				done : function(res) {
					//上传完毕回调
					if (res.success) {
						layer.msg("上传成功！")
						$("input[name='shopImg']").val(res.path);
						return;
					}
					layer.msg("上传失败！")
				},
				error : function() {
					layer.msg("请求接口异常！")
				}
			});
			//监听提交
			form.on('submit(add)', function(data) {
				
				$.post("adminUpdatePass",data.field,function(res){
					
					layer.msg(res.msg);
					if (res.success) {
						// 获得frame索引
						xadmin.close();
 					}
					setTimeout(function(){
						xadmin.father_reload();
					},1000)
					
				})
				return false;
			});

		});
		
		
		function del(){
			 $("#imgLook").empty();
			 $("input[name='maxPic']").val("");
			 layer.msg("已清空");
		}
	</script>
</body>

</html>